<template>
    <div>
       <el-button type="primary">
         添加角色
       </el-button>
       <!-- 表格 -->
       <el-table border :data="arr">
          <el-table-column type="index"></el-table-column>
          <el-table-column label="#" prop="id"></el-table-column>
          <el-table-column label="角色名称" prop="roleName"></el-table-column>
          <el-table-column label="角色描述" prop="roleDesc"></el-table-column>
          <el-table-column label="操作" align="center">
            <el-button size="mini" type="primary" icon="el-icon-edit">编辑</el-button>
            <el-button size="mini" type="danger" icon="el-icon-delete">删除</el-button>
            <el-button size="mini" type="warning" icon="el-icon-s-tools">权限</el-button>
          </el-table-column>
       </el-table>
    </div>
</template>

<script>
import { rolelie } from '@/api/role'

    export default {
        name:"roles",
        data() {
            return {
                /**
                 * 角色列表
                 */
                arr: [],
            }
        },
        created () {
            this.rolesList();
        },
        methods: {
           async rolesList() {
                try {
                    const arr=await rolelie()
                    this.arr=arr
                    console.log(arr);
                } catch (error) {}
            }
        },
    }
</script>

<style scoped>

</style>